<template>
	<view>
		<u-tabbar :value="current" :fixed="true" :placeholder="true" :safeAreaInsetBottom="true" @change="ChangBar">
			<u-tabbar-item v-for="(item,index) in tabBarlist" :key="index" :text="item.text"
				:icon="index ===  current ? item.iconPath_h : item.iconPath"></u-tabbar-item>
		</u-tabbar>

	</view>
</template>

<script>
	export default {
		name: 'TabBar',
		props: ['current'],
		data() {
			const tabBarlist = [{
					text: '首页',
					iconPath: 'https://api.femacise.cn/ico/home.png',
					iconPath_h: 'https://api.femacise.cn/ico/home_h.png',
					pagePath: "pages/index/index"
				},
				{
					text: '比赛',
					iconPath: 'https://api.femacise.cn/ico/match.png',
					iconPath_h: 'https://api.femacise.cn/ico/match_h.png',
					pagePath: "pages/match/match"
				},
				{
					text: '我',
					iconPath: 'https://api.femacise.cn/ico/me.png',
					iconPath_h: 'https://api.femacise.cn/ico/me_h.png',
					pagePath: "pages/mycenter/mycenter"
				}
			];
			return {
				tabBarlist
			}
		},
		methods: {
			ChangBar(e) {
				uni.$u.route({
					url: this.tabBarlist[e].pagePath,
					type: "switchTab"
				})
			}
		}
	}
</script>

<style lang="scss">
</style>